<!DOCTYPE html>
<html  xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:include="common/head :: htmlhead">
<body>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">系统日志</div>
                <div class="layui-card-body">
                    <div class="test-table-reload-btn" style="margin-bottom: 10px;">
                        搜索：
                        <div class="layui-inline">
                            <input class="layui-input" name="username" id="username" placeholder="用户名" autocomplete="off">
                        </div>
                        <div class="layui-inline">
                            <input class="layui-input" name="url" id="url" placeholder="请求接口" autocomplete="off">
                        </div>

                        <button class="layui-btn" data-type="reload">搜索</button>
                    </div>
                    <table class="layui-hide" id="table_demo" lay-filter="table_demo"></table>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    layui.use(['table','element','form'],function () {
        var table = layui.table
            ,element = layui.element
            ,form = layui.form;

        table.render({
            elem: '#table_demo'
            ,url: '/loglist'
            ,method : 'post'
            ,toolbar: true
            ,defaultToolbar: ['filter', 'print']
            ,cellMinWidth: 80
            ,page: true
            ,cols: [
                [{type:'checkbox', fixed: 'left'}
                ,{field: 'id', title: 'ID',  sort: true, fixed: 'left'}
                ,{field: 'username', title: '用户名'}
                ,{field: 'url', title: '请求接口'}
                ,{field: 'des', title: '描述'}
                ,{field: 'createtime', title: '时间',minWidth:150,
                    templet:'<div>{{ layui.util.toDateString(d.createtime, "yyyy-MM-dd HH:mm:ss") }}</div>'}
                ]
            ]
        });

        var $ = layui.$, active = {
            reload: function(){
                var username = $('#username');
                var url = $('#url');

                //执行重载
                table.reload('table_demo', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    ,where: {
                        username: username.val(),
                        url: url.val()
                    }
                });
            }
        };

        $('.test-table-reload-btn .layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    })
</script>
</body>
</html>